<template>
  <div class="container">
    <component
      :is="widget.name + 'Config'"
      :key="widget.id"
      :id="widget.id"
      :widget="widget"
      @change="formChange"
    ></component>
  </div>
</template>

<script lang="ts" setup>
defineProps<{
  widget: WidgetConfig
}>()

const emits = defineEmits<{
  (e: 'change', value: any): void
}>()

function formChange(value: any) {
  emits('change', value)
}
</script>

<style lang="scss" scoped></style>
